<template>
  <div class="components-container">
    <!-- <div class="header-form">
      <div class="layui-inline">
        <label class="layui-form-label">名称</label>
        <div class="layui-input-inline">
          <el-input v-model="selectData.NameLike" placeholder="输入名称"></el-input>
        </div>
      </div>
      <div class="layui-inline">
        <label class="layui-form-label">类别</label>
        <div class="layui-input-inline">
          <el-select v-model="selectData.TypeEquals" placeholder="请选择类别">
            <el-option v-for="item in UnttypeOptions" :key="item.value" :label="item.label" :value="item.value"> </el-option>
          </el-select>
        </div>
      </div>
      <div class="layui-inline">
        <label class="layui-form-label">统计地址</label>
        <div class="layui-input-inline">
          <el-cascader :options="UntyuseroupOptions" v-model="carryArea" filterable :show-all-levels="false" change-on-select>
          </el-cascader>
        </div>
      </div>
      <el-button type="primary" @click="btnSearch" :disabled="downloadLoading" :loading="this.$store.state.isloading">搜索</el-button>
      <el-button :disabled="this.$store.state.isloading || downloadLoading" @click="btnRepeat">重置</el-button>
    </div> -->
    <div>
      <ul class="toolList">
        <li v-if="btnShow(item.BTNVALUE)" v-for="(item, index) in $store.state.btnListCommon" @click="operate(item.BTNVALUE)">
          <el-button type="primary" :disabled="$store.state.isloading || downloadLoading" :value="item.BTNSHOWNAME" v-text="item.BTNSHOWNAME"></el-button>
        </li>
      </ul>
    </div>
    <dataTable :height="height" :headList="headList" :dataList="dataList" :pageOrder="pageOrder" @pageChange="pageChange" @selectRow="selectRow"></dataTable>
    <!-- <dataTable :headList="headList" :dataList="dataList" :hiddenWarn="hiddenWarn" :clounmnames="clounmnames" :pageOrder="pageOrder" @pageChange="pageChange" @selectRow="selectRow"></dataTable> -->
    <printmodal ref="printPdf"></printmodal>
    <!-- 操作弹窗 -->
    <main-model ref="dialog" @refreshData="getData"></main-model>
  </div>
</template>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/common.scss";
.el-button + .el-button {
    margin-left: 0;
}
.btn {
    text-align: center;
}
</style>
<script>
import dataTable from "@/components/Table/DataTable";
import printmodal from "@/components/Pdf/Print";
import apiBase from "@/api/apiBase.js";
import { formatDate, timeStringToDate } from "@/utils/date.js";
import { manage } from "@/mixins/managePage.js";
import { PRINT } from "@/components/Pdf/PDF.js";
import mainModel from "./watchingMain";
const EXPORT = "打印";
export default {
    name: "unitManage",
    mixins: [manage],
    data() {
        return {
            selectData: {},
            downloadLoading: false,
            OutDataExcel: [],
            message: null,
            height: "620",
            sweetModalWidth: 80,
            sweetModalMaxWidth: 1000,
            hiddenColumn: true,
            carryArea: [],
            UnttypeOptions: [],
            UntyuseroupOptions: []
        };
    },
    methods: {
        //功能操作
        operate(order) {
            this.order = order;
            switch (this.order) {
                case "修改":
                    this.$refs.dialog.open(this.order, this.currentRow.WAHID);
                    break;
                case "详情":
                    this.$refs.dialog.open("详情", this.currentRow.WAHID);
                    break;
                case "删除":
                    this.delete();
                    break;
                case "申请":
                    this.$refs.dialog.open("申请");
                    break;
                default:
            }
        },
      
        //删除
        delete() {
            this.$confirm("确认是否删除该数据?", "提示", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning"
            })
                .then(callback => {
                    let data = {
                        WAHID: this.currentRow.WAHID
                    };
                    apiBase.DoService(
                        data,
                        apiBase.getApiAdress().OnDuty.DeleteWah,
                        res => {
                            this.getData();
                        }
                    );
                })
                .catch(() => {
                    this.$message({
                        type: "info",
                        message: "已取消"
                    });
                });
        },
        getColumns() {
            let data = {};
            apiBase.DoService(
                data,
                apiBase.getApiAdress().Column.GetWatchingColumns,
                res => {
                    this.headList = res.data.content;
                }
            );
        },
     
        getData() {
            let data = {
                 PageIndex: this.pageOrder.currentPage,
                PageSize: this.pageOrder.pageSize,
                OrderBy: this.pageOrder.orderType,
                OrderByType: this.pageOrder.orderSort,
            };
            apiBase.DoService(
                data,
                apiBase.getApiAdress().OnDuty.QueryWah,
                res => {
                    this.dataList = res.data.content.OutData;
                    this.OutDataExcel = res.data.content.OutData;
                    this.pageOrder.totalNum = res.data.content.RecordCount;
                }
            );
        },
        // dataRepeat(){},
        btnRepeat() {
            this.selectData = {};
            this.getData();
        },
        btnShow(btn) {
            switch (btn) {
                case "申请":
                    return true;
                    break;
                case "修改":
                    if(this.currentRow) return true;
                    break;
                case "删除":
                    if(this.currentRow) return true;
                    break;
                case "详情":
                    if(this.currentRow) return true;
                    break;
                default:
                    return false;
            }
        }
    },
    mounted() {},
    components: {
        dataTable,
        mainModel,
        printmodal
    },

    created() {
        this.getColumns();
        this.getData();
    }
};
</script>